<%--
  User: LiXiaobo  Date: 2020/10/22 Time: 下午3:36
  To change this template use File | Settings | File Templates.
--%>
<!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@page isELIgnored="true" %>
<html>
<head>
    <title>角色管理</title>
    <base href="<%=request.getContextPath()%>/">
    <link rel="stylesheet" href="webjars/layui/2.5.5/css/layui.css">
</head>
<body>
    <div class="layui-main">
        <script type="text/html" id="toolbar">
            <div class="layui-btn-container">
                <button class="layui-btn layui-btn-sm" lay-event="add">添加角色</button>
                <button class="layui-btn layui-btn-sm" lay-event="grant">角色授权</button>
            </div>
        </script>
        <table id="roleTb" lay-filter="roleTb"></table>
        <div id="tree" style="margin-left:50px;display:none"></div>
    </div>

    <script src="webjars/layui/2.5.5/layui.js"></script>
<script>
    layui.use("table",function (){
        let table=layui.table;
        table.render({
            id:"roleTb",
            elem:"#roleTb",
            url:"/sys/role/list",
            toolbar:"#toolbar",
            cols:[[
                {type:"radio"},
                {field:"roleName",title:"名称"},
                {field:"roleCode",title:"编号"},
                {field:"creationDate",title:"创建时间"}
            ]]
        });
        table.on('toolbar(roleTb)',function({event,data}){
            switch (event){
                case "grant":
                    grant(data);
                    break;
            }
        })
    });

    /*角色授权*/
    function grant(data){
        layui.use(["layer","table","jquery","tree"],function(){
            let arr=layui.table.checkStatus("roleTb").data;
            let layer=layui.layer;
            if(arr.length==0){
                layer.alert("请选择一项待授权!");
                return;
            }
            let $=layui.$;
            let tree=layui.tree;
            let roleId= arr[0].id;
            $.get(`/sys/role/search4Tree?roleId=${roleId}`)
                .done(result=>{
                     tree.render({
                         id:"tree",
                         elem:"#tree",
                         data:result.data,
                         showCheckbox:tree
                     });
                    layer.open({
                        type:1,
                        skin:"layui-layer-molv",
                        offset:'t',
                        content:$("#tree"),
                        title:"角色授权",
                        area:["400px","400px"],
                        btn:['确定','取消'],
                        yes(index){
                            let checkData=tree.getChecked("tree");
                            let ids=[];
                            for(let node01 of checkData ){
                                ids.push(node01.id);
                                if(node01.children.length>0){
                                    for(let node02 of node01.children){
                                        ids.push(node02.id);
                                        if(node02.children.length>0){
                                            for(let node03 of node02.children){
                                                ids.push(node03.id);
                                            }
                                        }
                                    }
                                }
                            }
                            console.log(checkData);
                            console.log(ids);
                            $.post(`/sys/role/grant?roleId=${roleId}&ids=${ids}`)
                            .done(({msg})=>{
                                layer.msg(msg);
                                layer.close(index);
                            });
                        }
                    });


                });



        });

    }
</script>
</body>
</html>
